<template>
  <view class="profile-container">
    <view class="user-info">
      <image class="avatar" src="/static/default-avatar.png" mode="aspectFill"></image>
      <text class="username">{{ courierAccount }}</text>
    </view>
    
    <view class="menu-list">
      <view class="menu-item" @click="goToChangePassword">
        <text class="menu-text">修改密码</text>
        <text class="iconfont icon-right"></text>
      </view>
      <view class="menu-item" @click="logout">
        <text class="menu-text logout-text">退出登录</text>
        <text class="iconfont icon-right"></text>
      </view>
    </view>
  </view>
</template>

<script>
export default {
  data() {
    return {
      courierAccount: ''
    }
  },
  onShow() {
    // 获取存储的账号
    this.courierAccount = uni.getStorageSync('courierAccount') || '未登录'
  },
  methods: {
    goToChangePassword() {
      uni.navigateTo({
        url: '/pages/courier/changePassword'
      })
    },
    logout() {
      // 清除登录状态
      uni.removeStorageSync('courierAccount')
      uni.removeStorageSync('courierJWT')
      
      // 跳转到登录页
      uni.reLaunch({
        url: '/pages/login/courierLogin'
      })
    }
  }
}
</script>

<style scoped>
.profile-container {
  background-color: #f4f4f4;
  min-height: 100vh;
}

.user-info {
  background-color: white;
  display: flex;
  align-items: center;
  padding: 30px;
  margin-bottom: 20px;
}

.avatar {
  width: 80px;
  height: 80px;
  border-radius: 50%;
  margin-right: 20px;
}

.username {
  font-size: 18px;
  font-weight: bold;
}

.menu-list {
  background-color: white;
}

.menu-item {
  display: flex;
  justify-content: space-between;
  align-items: center;
  padding: 15px 20px;
  border-bottom: 1px solid #f0f0f0;
}

.menu-text {
  font-size: 16px;
}

.logout-text {
  color: #ff0000;
}

.iconfont {
  color: #999;
}
</style> 